<template>
	<!-- 底部弹出 -->
	<view class="pubpop">
		<u-popup v-model="pubbotshow" mode="bottom" @close="pubbotclose" :closeable="true" z-index="10075">
			<scroll-view scroll-y class="popview">
				<view class="shaiview">
					<view class="shaiitem" v-for="(item,index) in pagedata" :key="index">
						<text class="shaitit">{{item.title}}</text>
						<view class="shailist">
							<view class="shais" :class="getpages(currentpage,i.page)?'sactive':''"  v-for="(i,ind) in item.list" :key="ind" @click="getpageClick(i)">{{i.title}}</view>
						</view>
					</view>
					<!-- <view class="shaiitem">
						<text class="shaitit">级别</text>
						<view class="shailist">
							<view class="shais" :class="level_info.id==item.id?'sactive':''" v-for="(item,index) in level_data" :key="index" >{{ item.name }}</view>
						</view>
					</view> -->
				</view>
			</scroll-view>
		</u-popup>
	</view>
</template>

<script>
export default {
	props: {
		pubbotshow: {
			type: Boolean,
			default: false
		},
		currentpage:{
			type: String,
			default: ''
		}
	
	},
	name: "Nheader",
	data() {
		return {
			ispayPop: true,
			animat: this.isanimate(),
			cate_info:{
				id:''
			},
			pagedata:[]

		};
	},
	created(){
		// console.log("+++")
		this.gettabhome();//弹出路由内容
	},
	methods: {
		getsou(){
			uni.showToast({
				title: '点击此处',
				icon: 'success'
			})
		},
		pubbotclose() {
			this.$emit("pubbotclose");
		},
		connectWallet(){
			
			this.$emit("connectWallet");
		},
		gettantwo(){
			this.$emit("gettantwo");
		},
		gethome(){
			uni.switchTab({ url: '/pages/tabbar/Tabhome' })
		},
		async gettabhome(){
			let res = await this.$u.api.getPages({
			});
			this.pagedata = res
		},
		getpageClick(i){
			// console.log(i)
			if(i.page == 'pages/tabbar/Tabhome'||i.page == 'pages/tabbar/Shop'||i.page == 'pages/tabbar/Studnt'||i.page == 'pages/tabbar/Tiku'||i.page == 'pages/tabbar/My'){
				uni.switchTab({
					 url: "/"+i.page
				});
			}else if(i.page){
				this.navrouter("/"+i.page)
			}else{
				this.$u.toast("功能开发中");
			}
			
		},
		getpages(currentpage,page){
			let status = false
			if(page!=''){
				// let str = "Hello World";
				if (page.includes(currentpage)) {
					status = true
				} else {
					status = false
				}

			}
			return status
		}
	}
}
</script>

<style scoped lang="scss">
// 底部弹窗
.pubpop{
	/deep/.u-drawer-bottom{
		background-color: transparent;
	}
	.popview{
		padding: 30rpx 0 130rpx;
		background-color: #fff;
		border-radius: 40rpx 40rpx 0 0;
		max-height: 70vh;
		// #ifdef APP-PLUS
		padding-bottom: 130rpx;
		// #endif
	}
	.shaiview{
		padding: 25rpx 30rpx;
		// background-color: #fff;
		display: flex;
		flex-direction: column;
		position: relative;
		width: 100%;
		// z-index: 100;
		.shaiitem{
			margin-bottom: 20rpx;
			.shaitit{
				display: block;
				margin-bottom: 24rpx;
				font-family: PingFangSC;
				font-weight: bold;
				font-size: 24rpx;
				color: #333333;
			}
			.shailist{
				display: flex;
				flex-direction: row;
				flex-wrap: wrap;
				.shais{
					width: 31%;
					margin-right: 2%;
					height: 64rpx;
					background: #F8F8F8;
					border-radius: 32rpx;
					display: flex;
					align-items: center;
					justify-content: center;
					margin-bottom: 25rpx;
					font-weight: 500;
					font-size: 22rpx;
					color: #333333;
				}
				.sactive{
					background: #FFF0F0;
					color: #FA4E4E;
				}
			}
		}
		.shaiitem:last-child{
			margin-bottom: 0 !important;
		}
		
		.chongview{
			display: flex;
			flex-direction: row;
			align-items: center;
			justify-content: space-between;
			.czhi{
				width: 48%;
				height: 80rpx;
				background: #F8F8F8;
				border-radius: 40rpx;
				display: flex;
				align-items: center;
				justify-content: center;
				font-family: PingFang SC;
				font-weight: 500;
				font-size: 24rpx;
				color: #111111;
			}
			.que{
				width: 48%;
				height: 80rpx;
				background: linear-gradient(-90deg, #FA4E4E, #FD894F);
				border-radius: 40rpx;
				display: flex;
				align-items: center;
				justify-content: center;
				font-family: PingFang SC;
				font-weight: 500;
				font-size: 24rpx;
				color: #fff;
			}
		}
	}

}
</style>
